<template>
    <el-row>
    <el-col :span="8"><div class="grid-content ep-bg-purple" /></el-col>
    <el-col :span="8"><div class="grid-content ep-bg-purple-light" />
        账号:<el-input v-model="store.userName" placeholder="请输入账号" style="width: 200px"/>
    <br>
    密码:<el-input v-model="store.pwd" type="password" placeholder="请输入密码" show-password style="width: 200px"/>
    </el-col>
    <el-col :span="8"><div class="grid-content ep-bg-purple" /></el-col>
    <el-col style="margin-left:500px"><el-button type="success" @click="onLink">登陆</el-button></el-col>
    
  </el-row>
  
</template>

<script setup>
import { RouterView, RouterLink,useRoute,useRouter,onBeforeRouteUpdate,onBeforeRouteLeave } from 'vue-router'
import { ref, reactive,defineProps } from 'vue'
import {useLoginStore} from '@/stores/login.js'

const store = useLoginStore();  //username pwd

console.log(store);

//当前的路由对象
const route = useRoute();

//整个路由对象
const router = useRouter();
console.log(router);
//自动触发
/* onBeforeRouteUpdate(()=>{
  console.log('组件更新触发');
})

onBeforeRouteLeave(()=>{
  console.log('要离开了');
}) */

function onLink(){
  router.push('/home/products')
}



</script>